<template>
    <div class="">
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item><i class="el-icon-message"></i>&nbsp;待审核列表</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="container">
            <!-- tabs -->
            <div class="handle-tab">
                <el-tabs v-model="activeTab"  @tab-click="handleClick">
                    <el-tab-pane label="印厂" name=1></el-tab-pane>
                    <el-tab-pane label="设备" name=2></el-tab-pane>
                    <el-tab-pane label="招聘" name=3></el-tab-pane>
                    <el-tab-pane label="供应" name=4></el-tab-pane>
                    <el-tab-pane label="求购" name=5></el-tab-pane>
                    <el-tab-pane label="心情" name=6></el-tab-pane>
                    <el-tab-pane label="二手" name=7></el-tab-pane>
                    <el-tab-pane label="活动" name=8></el-tab-pane>
                    <el-tab-pane label="动态" name=9></el-tab-pane>
                </el-tabs>
            </div>
            <!-- 筛选条件 -->
            <div style="height:40px"></div>
            <el-form :inline="true"  class="demo-form-inline" style="margin-bottom:15px;">
                <el-form-item label="用户昵称:">
                    <el-input v-model="userName" placeholder="请输入用户昵称" clearable style="width:280px;"></el-input>
                </el-form-item>
                <el-form-item :label="titleDate">
                    <el-input v-model="title" :placeholder="titleSubDate" clearable style="width:280px;"></el-input>
                </el-form-item>
                
                <el-form-item >
                    <el-button type="primary" @click="onSelect"> &nbsp;&nbsp;查询&nbsp;&nbsp;  </el-button>
                    <el-button type="primary" @click="onResetting"> &nbsp;&nbsp;重置&nbsp;&nbsp;  </el-button>
                </el-form-item>
            </el-form>
            <!-- 这里引入table数据子组件（6个孩子，不同条件显示） -->
            <factory :data="tableData" v-show="activeTab == 1"  @run="getDate"></factory>
            <equipment :data="tableData" @run="getDate" v-show="activeTab == 2"></equipment>
            <recruit :data="tableData" v-show="activeTab == 3"   @run="getDate"></recruit>
            <supply :data="tableData" v-show="activeTab == 4"  @run="getDate"></supply>
            <buy :data="tableData" v-show="activeTab == 5"  @run="getDate"></buy>
            <mood :data="tableData" v-show="activeTab == 6"  @run="getDate"></mood>
            <hand :data="tableData" v-show="activeTab == 7"  @run="getDate"></hand>
            <activity :data="tableData" v-show="activeTab == 8"  @run="getDate"></activity>
            <dynamic :data="tableData" v-show="activeTab == 9"  @run="getDate"></dynamic>
            <!-- 分页 -->
            <div class="pagination" v-show="totalPages>1">
                <el-pagination  v-if="paginationShow" @current-change="handleCurrentChange"  :current-page.sync="currentPage" layout="prev, pager, next" :page-size="pageSize" :total="totalElements" background>
                </el-pagination>
            </div>     
        </div>
    
    </div>
</template>
<script>
import {getpubCheckList,postCheckPublish,} from '@/api/check/publish'
import factory from './components/factory'
import equipment from './components/equipment'
import recruit from './components/recruit'
import supply from './components/supply'
import buy from './components/buy'
import mood from './components/mood'
import hand from './components/hand'
import activity from './components/activity'
import dynamic from './components/dynamic'

export default {
    name:"checkPublishList",
     //声明组件
    components:{
        factory,
        equipment,
        recruit,
        supply,
        buy,
        mood,
        hand,
        activity,
        dynamic
    },
    data() {
        return {
            pageIndex:1,//当前页码
            pageSize:10,//每页10条
            currentPage:0,//当前页码的active状态
            totalElements:1,//默认的总条数
            totalPages:1,//默认的总页数
            paginationShow:true,//重新显示分页
            tableData:[],//表格数据
            delVisible:false, //默认dialog 不弹出
            title:'', //标题
            titleDate:'标题：',
            titleSubDate:'请输入查看内容标题',
            userName:'',//用户昵称
            options:[{state:0,label:'审核中'},{state:1,label:'审核不通过'},{state:2,label:'审核通过'}],//审核状态option选项
            state:0,//下来选中 0审核中，1审核不通过，2审核通过
            activeTab:"1",//tabs默认选中  发布分类：1印厂,2设备,3招聘,4供应,5求购,6心情
            isChecked:false,//审核界面默认隐藏 true显示
            data:'',//获取到详情的数据
            id:'',//当前用户id
            isFlag:'',//
        }
    },
    //实例创建
    created(){
        this.getDate();

    },
    //计算属性
    watch:{
 
    },
    //方法
    methods: {
        //获取数据
        getDate(){
            let activeTab=this.activeTab;
            if(activeTab==1){
                this.titleDate='公司名称：'
                this.titleSubDate='请输入公司名称'
            }
            if(activeTab==2){
                this.titleDate='设备名称：'
                this.titleSubDate='请输入设备名称'
            }
             if(activeTab==3){
                this.titleDate='职位名称：'
                this.titleSubDate='请输入职位名称'
            }
            if(activeTab==4){
                this.titleDate='供应产品名：'
                this.titleSubDate='请输入供应产品名'
            }
            if(activeTab==5){
                this.titleDate='求购产品名：'
                this.titleSubDate='请输入求购产品名'
            }
            if(activeTab==6){
                this.titleDate='标题：'
                this.titleSubDate='请输入标题'
            }
            if(activeTab==7){
                this.titleDate='名称：'
                this.titleSubDate='请输入产品名称'
            }
             if(activeTab==8){
                this.titleDate='标题：'
                this.titleSubDate='请输入标题'
            }
            if(activeTab==9){
                this.titleDate='标题：'
                this.titleSubDate='请输入标题'
            }
            getpubCheckList(this.state,this.activeTab,this.userName,this.title,this.pageIndex,this.pageSize).then((response)=> {
                if(response.code==200){
                    var data = response.data;//当前返回的数据
                    this.tableData = data.list;//列表数据
                    // console.log(this.tableData);
                    this.totalElements = data.total; //总条数
                    this.totalPages = Math.ceil(data.total/this.pageSize);//总页数

                    //把图片数组转对象
                    this.tableData.forEach((item)=>{
                        if(item.img_list){
                            item.img_list=JSON.parse(item.img_list)
                        }
                    })
                }else{
                    this.$notify.error({
                        title: '异常',
                        offset: 100,
                        message: response.msg
                    });
                }
            })
        },
        //改变分类选项change
        handleClick(){
            //清空title的值
            this.title = '';
            this.pageIndex=1;
            this.currentPage=1;

            this.paginationShow = false   //分页器消失
            this.$nextTick(function () {
                //分页器重新加载 解决element 分页器的无法触发current-change事件 只限在tabs页 
                this.paginationShow = true  
            })

            this.getDate();
        },
        //发布
        urlAdd(){
            this.$router.push({ path:'/substation/add'})
        },
        //查询
        onSelect(){
            this.pageIndex =1;
            this.getDate();
        },
        //重置筛选条件
        onResetting(){
            this.userName = '';
            this.title = '';
            this.getDate();
        },
        // //tabs切换触发
        // changState(tab) {
        //     //改变tab激活项
        //     this.activeTab = tab.name;
        //     console.log(tab.name);
        //     //当前页面
        //     this.pageIndex =1; 
        //     this.currentPage=1;
        //     this.getDate();
        // },
        //分页
        handleCurrentChange(val){
            this.pageIndex=val;
            this.currentPage=val;
            this.getDate();
        },
        //查看详情
        handleLook(index,row){
            if(row.id && row.id>0){
                //跳转到详情页
                // this.$router.push({ path: '/enterprise/details',query:{id:row.id}});
                this.$router.push({ path: '/press/productWatch',query:{id:row.id}});
            }
        },
        
    }
}
</script>
<style lang="stylus" scoped>
    .edit{
        color #ff9800;
    }
    .del{
        color #e51c23;
    }
    .download{
        color #67C23A;
    }
</style>


